<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

    <div id="pie" style="width: 1000px; height: 800px"></div>

    <script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.1.0/echarts.min.js"></script>
    <script>
        const option = {
            title: {
                text: '销售额占比',
                subtext: '纯属虚构',
                left: 'left'
            },
            legend: {
                top: 'top'
            },
            tooltip: {
                trigger: 'item'
            },
            toolbox: {
                show: true,
                feature: {
                    mark: {show: true},
                    dataView: {show: true, readOnly: false},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            series: [
                {
                    name: '面积模式',
                    type: 'pie',
                    radius: [50, 250],
                    center: ['50%', '50%'],
                    roseType: 'area',
                    itemStyle: {
                        borderRadius: 8
                    },
                    data: [

                    ]
                }
            ]
        };
        var chartDom = document.getElementById('pie');
        var myChart = echarts.init(chartDom);

        fetch("/acb/t_circle").then(response => response.json()).then(res =>{
            option.series[0].data.push({name: item.name,value: item.count})
        })
        console.log(option)
        myChart.setOption(option);
    </script>

</body>
</html>